<template>
    <el-form :inline="true" :model="container" class="search-form" style="margin-top:10px" label-width="100px">
        <el-row>
            <el-col :span="6">
                <el-form-item label="箱号">
                    <!-- <el-input :disabled="containerNoShow" style="width:150px" v-model="container.containerNo"></el-input> -->
                    <auot-search-gate :type="type" :disabled="containerNoShow" @clear="handleSelect" :styleProps="'width:150px'" :name="container.containerNo" @matchRecord="handleSelect"></auot-search-gate>
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="箱型">
                    <el-input style="width:150px" :disabled="true" v-model="container.containerType"></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="尺寸">
                    <el-input style="width:150px" :disabled="true" v-model="container.containerSize"></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="空重">
                    <el-select style="width:150px" :disabled="true" placeholder=" " v-model="container.ifHeavy">
                        <el-option v-for="[key, val] in _dictIfHeavyType" :key="key" :label="val" :value="key">
                        </el-option>
                    </el-select>
                </el-form-item>
            </el-col>
        </el-row>
        <el-row>
            <el-col :span="6">
                <el-form-item label="内外贸">
                    <el-select style="width:150px" :disabled="true" placeholder=" " v-model="container.tradeType">
                        <el-option v-for="[key, val] in _dictTradeType" :key="key" :label="val" :value="key">
                        </el-option>
                    </el-select>
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="箱主">
                    <el-input style="width:150px" :disabled="true" v-model="container.ownerName"></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="货名">
                    <el-input style="width:150px" :disabled="true" v-model="container.cargoName"></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="货重">
                    <el-input style="width:150px" :disabled="true" v-model="container.cargoWeight"></el-input>
                </el-form-item>
            </el-col>
        </el-row>
    </el-form>
</template>

<script>
import auotSearchGate from "@/components/autocomplete/autoSearchGate";
import { ifHeavyType, tradeType } from "@/assets/dict";
export default {
    props: {
        container: {
            type: Object,
            default: {}
        },
        containerNoShow: {
            type: Boolean,
            default: false
        },
        type: {
            type: String,
            default: "in"
        }
    },
    components: {
        auotSearchGate
    },
    data() {
        return {};
    },
    methods: {
        handleSelect(item) {
            console.log(item);
            this.container.containerNo = item.containerNo;
            this.container.entrustNo = item.entrustNo;
            this.container.containerType = item.containerType;
            this.container.containerSize = item.containerSize;
            this.container.ifHeavy = item.ifHeavy;
            this.container.tradeType = item.tradeType;
            this.container.ownerName = item.ownerName;
            this.container.ownerId = item.ownerId;
            this.container.cargoName = item.cargoName;
            this.container.cargoWeight = item.cargoWeight;
            this.container.importAndExport = item.importAndExport;
        },
    },
};
</script>

<style>
</style>
